<template>
    <div class="con">
        <div class="header">
            <p>请截屏保存该二维码页面分享邀新</p>
            <img src="../assets/images/sharetoutu.png" alt class="toutu" />
        </div>
        <div class="ewm">
             <div id="qrcode"> </div>
             <p style="margin-top:30px">扫描上方二维码注册卡宝钱包</p>
             <p>立享 <b>最高50000元专属备用金</b></p>
        </div>
    </div>
</template>

<script>
import QRCode from "qrcodejs2";
export default {
    name: "share",
    data() {
        return {
            timestamp: "",
            url: "",
        };
    },
    methods: {},
    mounted() {
        this.timestamp = Date.parse(new Date());
        this.url =`https://pda.aixuepai.com.cn/kbWallet/#/?code=098313&userId=${localStorage.getItem("userId")}`;
                    let qrcode = new QRCode("qrcode", {
                        width: 200,
                        height: 200, // 高度
                        text: this.url // 二维码内容
                    });
    }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.con {
    width: 100%;
    min-height: 100vh;
    background: #ffae4e;
    position: relative;
}
.con .header {
    position: relative;
}
.con .header p {
    position: absolute;
    width: 100%;
    text-align: center;
    color: #a67232;
    font-size: 12px;
    top: 12px;
}
.con .header .toutu {
    width: 100%;
}
.con .ewm{
    width: 240px;
    height: 240px;
    background: #fff;
    position: absolute;
   left: 50%;
   margin-left: -120px;
   top: 44%;   
}
.con .ewm #qrcode{
    margin: 20px;
}
.con .ewm p{
    font-size: 12px;
    text-align: center;
}
</style>
